<template>
  <div class="record">
    <div class="tablist">
      <van-tabs v-model="active"
                type="card"
                color="#1989FA"
                animated
                @change="tabChange">
        <van-tab title="全部"></van-tab>
        <van-tab title="进入登记"></van-tab>
        <van-tab title="出门登记"></van-tab>
      </van-tabs>
    </div>

    <div class="list">
      <van-panel v-for="(item,index) in list"
                 :key="index"
                 :title="item.inout"
                 :desc="item.c_time"
                 :status="item.temperature+'℃'">
      </van-panel>
    </div>
  </div>
</template>

<script>
import { Notify, Toast } from 'vant'

export default {
  name: 'record',
  data () {
    return {
      active: 0,
      list: []
    }
  },
  created () {
    this.getaccessRecord()
  },
  methods: {
    tabChange () {
      this.getaccessRecord()
    },
    async getaccessRecord () {
      let { active } = this
      Toast.loading({
        duration: 5,
        forbidClick: true,
        message: '加载中...'
      })
      let accessRecord = await this.axios.post(this.api.accessRecord, { active })
      if (accessRecord.code == 200) {
        if (accessRecord.data != 'null') {
          this.list = accessRecord.data
        } else {
          this.list = []
        }
        Notify({ type: 'success', message: '获取成功' })
      } else {
        Notify({ type: 'danger', message: '获取失败' })
      }
      Toast.clear()
    }
  }

}
</script>

<style lang="scss" scoped>
.tablist {
  padding: 30px 0;
}
</style>
